body {
    background-color:#F5F5F5;
    margin: 6px auto;
    width: 950px;
}

#page {
	-webkit-box-shadow: 1px 1px 1px 1px rgba(10, 10, 10, 0.3);
	-moz-box-shadow: 1px 1px 1px 1px rgba(10, 10, 10, 0.3);
	-o-box-shadow: 1px 1px 1px 1px rgba(10, 10, 10, 0.3);
	box-shadow: 1px 1px 1px 1px rgba(10, 10, 10, 0.3);
    float:left;
    width: 930px;
    padding:5px;
    background-color:#F6F6E9;
}

section {
	background-color:#F6F6E9;
    float:left;
    width:460px;
}

#banner{
	background-image: url("../images/Ban.JPG");
    width: 100%;
	height: 137px;
}

#seccion{
	background-color:#F6F6E9;
    width: 460px;
	margin: 0 auto;
}


article {
    margin-bottom:5px;
    padding: 10px;
    border-radius: 20px 10px 10px 10px;
    border-style: solid;
    border-width: 0px;
    border-color:#777777;
}


#articulo1 {
	width:440px;
	float:left;
    margin-bottom:5px;
    padding: 10px;
    border-radius: 20px 10px 20px 10px;
    border-style: solid;
    border-width: 2px;
    border-color:#777777;
}

p {
    text-align:justify;
}

footer{
    border-color: #FFFFFF;
    border-style: solid;
    border-width: 0px;
    text-align: center;
    width: 930;
    padding:5px;
    background-color : #668291;
}


/*--- estilos para los ul y li del formulario ---*/
.formulario ul {
    width:450px;
    list-style-type:none;
    margin:0px;
    padding:0px;
}

.formulario li{
    padding:12px; 
    position:relative;
}

.formulario label{
    color: #333333;
    display: inline-block;
    float: left;
    font-family: sans-serif;
    font-size: 13 px;
    font-weight: bold;
    margin-top: 3px;
    padding: 3px;
    width: 110px;
}

.formulario input {
    height:20px; 
    width:220px; 
    padding:5px 8px;
}

.formulario button {
    margin-left:70px;
    width:100px;
    height: 40px;
    text-align: center;
    vertical-align:top;
}

/*----- estilos de la barra de navegacion --------*/
nav {
	position : relative;
	width : 100%;
	height: 40px;
	background-color : #668291;
}

nav ul {
	margin : 0 auto;
	width : 940px;
	list-style : none;
}

nav ul li {
	float : left;
}

nav ul li a {
	display : block;
	margin-right : 20px;
	width : 120px;
	font-size : 16px;
	line-height : 39px;
	text-align : center;
	text-decoration : none;
	color : #ccc;
	color: #ffffff;
	border-radius: 20px 20px 20px 20px;
}

nav ul li a:hover {
	background-color: #587280;
	color : #CCCCCC;
}

nav ul li.selected a {
	color : #000000;
}

/*----- estilos visuales de los elementos --------*/
.formulario input, .formulario textarea { 
    border:1px solid #aaa;
    box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset;
    border-radius:2px;
    color: #888;
    font-size: 12px;
    padding-right:30px;
    -moz-transition: padding .30s; 
    -webkit-transition: padding .30s; 
    -o-transition: padding .30s;
    transition: padding .30s;
}

.formulario input:focus{
    background: #fff; 
    border:1px solid #555; 
    box-shadow: 0 0 3px #aaa; 
    padding-right:80px;
}

.formulario input:required:valid{
    box-shadow: 0 0 5px #0CD297;
    border-color: #28921f;
}
.formulario input:focus:invalid{
    box-shadow: 0 0 5px #FF0000;
    border-color: #FF0000
}

/* === Estilos del boton de Envio === */
button.submit {
border:1px solid #b7b7b7;
 -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size:12px;
  font-family:arial, helvetica, sans-serif; 
  padding: 10px 10px 10px 10px; 
  text-decoration:none; 
  display:inline-block;
  text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
  font-weight:bold; 
  color: #FFFFFF;
 background-color: #d3d3d3; background-image: -webkit-gradient(linear, left top, left bottom, from(#d3d3d3), to(#707070));
 background-image: -webkit-linear-gradient(top, #d3d3d3, #707070);
 background-image: -moz-linear-gradient(top, #d3d3d3, #707070);
 background-image: -ms-linear-gradient(top, #d3d3d3, #707070);
 background-image: -o-linear-gradient(top, #d3d3d3, #707070);
 background-image: linear-gradient(to bottom, #d3d3d3, #707070);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d3d3d3, endColorstr=#707070);
}

button.submit:hover{
 border:1px solid #a0a0a0;
 background-color: #bababa; background-image: -webkit-gradient(linear, left top, left bottom, from(#bababa), to(#575757));
 background-image: -webkit-linear-gradient(top, #bababa, #575757);
 background-image: -moz-linear-gradient(top, #bababa, #575757);
 background-image: -ms-linear-gradient(top, #bababa, #575757);
 background-image: -o-linear-gradient(top, #bababa, #575757);
 background-image: linear-gradient(to bottom, #bababa, #575757);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#bababa, endColorstr=#575757);
}

button.submit:active {
    border: 1px solid #222;
    box-shadow: 0 0 10px 5px #444 inset;
}


/*
*************************************************************************************
*                                                                                   *
*                                   CSS JAIR PARA TABLA                             *
*                                                                                   *
*                                                                                   *
*************************************************************************************
*/

/*****************************************ESTILO TABLA*******************************/
table { background:#D3E4E5;
        border:1px solid gray;
        border-collapse:collapse;
        color:#fff;
        font:normal 12px verdana, arial, helvetica, sans-serif;}

/*ESTILO DE LA CABECERA DE LA TABLA*/
thead th, tfoot th {/*background:#20B2AA;*/
                    background:#668291;
                    color:#FFFFFF;
                    padding:3px 10px 3px 10px;
                    text-align:left;
                    text-transform:uppercase;}

caption {border:1px solid #5C443A;
          color:#5A443A;
          font-weight:bold;
          letter-spacing:10px;
          padding:6px 4px 8px 0px;
          text-align:center;
          text-transform:uppercase;}


td, th {color:#363636;
        padding:.4em;}

tr { border:1px dotted gray;}

/*ESTILO DEL CUERPO DE LA TABLA*/
tbody td a { color:#363636;
             text-decoration:none;}

tbody td a:visited { color:red;
          text-decoration:line-through;}

tbody td a:hover { text-decoration:underline;}

tbody th a { color:#363636;
             font-weight:normal;
             text-decoration:none;}

tbody th a:hover { color:#363636;}

tbody td+td+td+td a { background-image:url('http://www.admixweb.com/downloads/csstablegallery/bullet_blue.png');
                      background-position:left center;
                      background-repeat:no-repeat;
                      color:#03476F;
                      padding-left:15px;}
tbody td+td+td+td a:visited { background-image:url('http://www.admixweb.com/downloads/csstablegallery/bullet_white.png');
 background-position:left center;
 background-repeat:no-repeat;}

tbody th, tbody td { text-align:left;
                     vertical-align:top;}

tbody tr:hover { background:#99BCBF;
                 border:1px solid #03476F;
                 color:#000000;}
/*ESTILO PARA EL PIE DE LA TABLA*/
tfoot td { /*background:#20B2AA;*/
           background:#668291;
           color:#FFFFFF;
           padding-top:3px;}

.odd { background:#fff;}


/************************ESTILO MENU*************************************/
/** {margin: 0px;
   padding: 0px; outline: 0;}*/

/*html, body {width: 100%;}

body {background: #366;
font-family: Verdana, Arial, Helvetica, sans-serif;}*/

#menu {border:0px solid black;       
       font-size: 0.8em;
       width: 880px;
       margin: 0px auto;
       height: 60px;
       padding: 0px;
       border-radius:0.7em;}

#menu ul {list-style-type: none;}

#menu ul li {width: 162px;}

#menu ul li.nivel1 { float: left;
         margin-right: 1px;}

#menu ul li a {display: block;
               text-decoration: none;
               color: #fff;
               /*background-color: #399;*/
               background-color: #587280;
               border: solid 1px #fff;
               padding: 8px;
               position: relative;
                border-radius: 10px 10px 10px 10px;}

#menu ul li a.nivel2, #menu ul li a.nivel2ie{color: #FFF;}

#menu ul li a.nivel1, #menu ul li a.nivel2 {display: block!important;
                                            display: none;
                                            position: relative;}
#menu ul li:hover {position: relative;}


#menu ul li a:hover, #menu ul li:hover a.nivel1 {background-color: #D3E4E5;
                                                 color: #000;
                                                 position: relative;}

#menu ul li ul {display: none;}

#menu ul li:hover  ul.nivel2, #menu ul li a:hover  ul.nivel2{display: block;
                                                             position: absolute;
                                                             left: 0px;}

#menu ul li ul li a:hover ul.nivel3, #menu ul li ul li:hover ul.nivel3 {display: block;
                                                                        position: absolute;
                                                                        left: 161px!important;
                                                                        left: 160px;
                                                                        top:0px!important;
                                                                        top: -21px;}
#menu ul li ul li a {width: 160px;
                     padding: 8px 0px;
                     border-top-color: transparent;}
#menu ul li ul li a:hover {border-top-color: #000;
       position: relative;}

#menu ul li ul li ul li a.primera {border-top-color: #fff;}

table.falsa {border-collapse:collapse;
             border:0px;
             float: left;
             position: relative;}

/*ESTILO BOTON EDITAR*/
.enlaceboton {
    font-family: arial, sans-serif;
    font-size: 10pt;
    font-weight: bold;
    padding: 4px;
    /*background-color: #ffffcc;*/
    background-color: #D3E4E5;
    color: #666666;
    text-decoration: none;
}
.enlaceboton:link, .enlaceboton:visited {
    border-top: 1px solid #cccccc;
    border-bottom: 2px solid #666666;
    border-left: 1px solid #cccccc;
    border-right: 2px solid #666666;
}
.enlaceboton:hover {
    border-bottom: 1px solid #cccccc;
    border-top: 2px solid #666666;
    border-right: 1px solid #cccccc;
    border-left: 2px solid #666666;} 
